<!DOCTYPE>
<html>

<head>
  <meta charset="utf-8">
  <title>IFE JavaScript Task 31</title>
  <script src="js/task31.js"></script>
</head>

<body>
  <fieldset>
    <legend><a href="http://ife.baidu.com/task/detail?taskId=30">说明</a></legend>
    <dl>
      <dt>任务目的</dt>
      <dd>加强对JavaScript的掌握</dd>
      <dd>熟悉常用表单处理逻辑</dd>
    </dl>
    <dl>
      <dt>任务目的</dt>
      <dd>如<a target="_blank" href="http://7xrp04.com1.z0.glb.clouddn.com/task_2_31_1.jpg">示例图</a>中所示，在页面中完成两个单选框，切换单选框的不同选项时下方显示的表单随之切换。</dd>
      <dd>当选择在校生时，出现两个select下拉菜单，一个选择城市，一个选择学校，当选择非在校生时，出一个文本输入框</dd>
      <dd>学校下拉菜单里的学校名单均为城市下拉菜单中所选的城市中的大学，当城市发生变化时，学校一起发生变化</dd>
      <dd>城市及学校的数据随意编造即可，无需真实完整</dd>
    </dl>
  </fieldset>

  <div id="box">
    <p id="radoi">
      <label><input type="radio" name="type" value="1">在校生</label>
      <label><input type="radio" name="type" value="0">非在校生</label>
    </p>
    <p>
      <label id="name" style="display:inline-block;width:80px;">学校</label>
      <span id="school-box">
        <select name="city" id="city">
        </select>
        <select name="school" id="school">
        </select>
      </span>
      <input type="text" id="company">
    </p>
  </div>
</body>

</html>
